<template>
  <div class="dmform-treecascader" :class="{'dmform-treecascader-m': multiple}">
    <div class="_btns_left" v-if="multiple">
      <span class="global-red">共选择了 {{resultRows?resultRows.length:0}} 条数据</span>
    </div>
    <div class="_btns">
      <a-button @click.stop="doReset">重置</a-button>
      <a-button @click.stop="doClear">清空</a-button>
      <a-button @click.stop="doCancel">取消</a-button>
      <a-button type="primary" @click.stop="doConfirm">确定</a-button>
    </div>
    <div class="_result">
      <span v-if="!resultRows || resultRows.length==0" class="_nodata">暂无选中的数据</span>
      <a-tag v-else v-for="(row) in resultRows" :key="row.id" color="blue" :visible="true" :closable="true"
             @close="doRemove(row.id)">
        {{ row.name }}
      </a-tag>
    </div>
    <table>
      <tr>
        <td style="width:300px">
          <div class="_panel1">
            <a-tabs default-active-key="1" :animated="false" :class="{'hide-tabbar': !panel1.title}">
              <a-tab-pane key="1" :tab="panel1.title">
                <div :style="{height:height+'px'}" style="overflow: auto;">
                  <TreeSelect :dataUrl="panel1.dataUrl"
                              :emptyText="panel1.emptyText"
                              :queryParams="panel1Params"
                              @onNodeClick="doPanel1NodeClick">
                  </TreeSelect>
                </div>
              </a-tab-pane>
            </a-tabs>
          </div>
        </td>
        <td>
          <div class="_panel2">
            <div :style="{height:height+'px'}" style="overflow: auto; padding: 10px;">
              <ListSelect
                  :dataUrl="panel2.dataUrl"
                  :emptyText="panel2.emptyText"
                  :queryParams="panel2Params"
                  :multiple="multiple"
                  :value="resultKeys"
                  @onRadioChange="doPanel2RadioChange"
                  @onCheckChange="doPanel2CheckChange"
                  @onCheck="doPanel2Check">
              </ListSelect>
            </div>
          </div>
        </td>
      </tr>
    </table>
  </div>
</template>
<script>
import ListCascaderJS from './ListCascader.js'
export default {
  name: 'ListCascader',
  mixins: [ListCascaderJS],
}
</script>
